<div class="layout_content">
    <header class="demo-header" style="padding-top: 10px;">
        <div class="titleLeft flt">
            <a href="javascript:history.go(-1);">
                <img src="<?php echo WEBIMG . '/back.png'; ?>" width="35px" height="33px">
            </a>
        </div>
        <div class="titleRight flt text-center">商品详情</div>
    </header>
    <div class="am-modal am-modal-loading am-modal-no-btn" tabindex="-1" id="my-modal-loading">
        <img src="<?php echo $ApiData['icon_url']; ?>" class="img-width"/>
    </div>
    <div class="flt product-detail pline">
        <p class="product">名称:<?php echo $ApiData['name']; ?></p>
        <p class="guige">单位: <?php echo $ApiData['individual_packing']; ?></p>
        <p class="guige">规格：<?php echo $ApiData['mass_packing']; ?></p>
    </div>
    <div class="flt detail-money">
        <p class="price">￥<?php echo $ApiData['channel_price']; ?></p>
        <p class="guige">
            <del>￥5.2</del>
        </p>
    </div>
    <div class="detail-descript guige pline">
        描述：<?php echo $ApiData['remark']; ?>
    </div>
    <?php if (count($ApiData['activity_info']) > 0) { ?>
        <div class="padding-adjust1">
            <div class="flt" style="width: 15%;text-align: right;padding-top: 5px;">促销:</div>
            <div class="flt cuxiao-font" style="width: 85%;">
                <?php foreach ($ApiData['activity_info'] as $val) { ?>
                    <?php if ($val['type'] == 1) { ?>
                        <div><img src="<?php echo WEBIMG; ?>/cufan.png" class="img-middle cuxiao-img"/>月销售额满100万返点5%
                        </div>
                    <?php } elseif ($type == 2) { ?>
                        <div><img src="<?php echo WEBIMG; ?>/cuman.png" class="img-middle cuxiao-img"/>单笔订单满100赠本品10份
                        </div>
                    <?php } elseif ($type == 3) { ?>
                        <div><img src="<?php echo WEBIMG; ?>/cuzhe.png" class="img-middle cuxiao-img"/>折扣90%</div>
                    <?php } ?>
                <?php } ?>
            </div>
        </div>
    <?php } ?>
    <div class="detail-descript pline fontsize lineheight flt" id="guige_txt" style="line-height: 3em;">
        选择产品参数
    </div>
    <div style="clear: both;"></div>
    <div class="padding-adjust2 fontsize padding-adjust3 padding-adjust2">宝贝详情</div>
    <div style="margin-bottom: 3.5em;">
        <?php if ($ApiData['rich_text_url']) { ?>
            <iframe src="<?php echo $ApiData['rich_text_url']; ?>" width="100%"
                    style="border: 0px; height: auto;"></iframe>
        <?php } ?>
    </div>

    <footer id="my-modal-searchloading">
        <div class="dibu-botton dibu-top-status3 dis cur" id="dibu-botton">
            <div class="flt padding-adjust3 detail-foot1" id="tohome"
                 rel="<?php echo $ApiData['collection_status']; ?>">
                <?php if ($ApiData['collection_status']) { ?>
                    <img src="<?php echo WEBIMG . '/footcollect.png'; ?>"/>
                <?php } else { ?>
                    <img src="<?php echo WEBIMG . '/footcollectmoren.png'; ?>"/>
                <?php } ?>
                <p>收藏</p>
            </div>
            <div class=" flt padding-adjust3 detail-foot2" id="yitel" onclick="ShowDiv(1);">
                <img src="<?php echo WEBIMG . '/footbuymoren.png'; ?>"/>
                <p>加入购物车</p>
            </div>
            <div class="flt detail-foot3 text-center" id="dibuzixun" onclick="sendOrder(this);">
                立即购买
            </div>
        </div>
    </footer>
</div>

<script>
    $(function () {
        $("#guige_txt").bind('click', function () {
            ShowDiv();
            $(".foot-confirm").removeAttr('onclick');

            $(".foot-confirm").bind('click', function () {
                var gid = $(".proNum").find('input[name="gid"]').val();
                var num = parseInt($(".proNum").find('input[name="num"]').val());

                if (gid && num) {
                    CloseDiv();
                } else {
                    Tip('请选择产品参数');
                }
                return false;
            });
        });
        $("#tohome").bind('click', function () {
            var id = '<?php echo $ApiData['id'];?>';
            var type = parseInt($(this).attr('rel')) ? 0 : 1;
            if (!id) {
                Tip('参数错误');
                return false;
            }
            $.ajax({
                url: '/ajax/product/',
                type: 'post',
                dataType: 'json',
                data: {'ajaxdata': 'addFav', 'id': id, 'type': type},
                success: function (response) {
                    if (response.code == 200) {
                        $("#tohome").attr('rel', type);
                        if (type == 1) {
                            $("#tohome").find('img').attr('src', '<?php echo WEBIMG . '/footcollect.png'; ?>');
                        } else {
                            $("#tohome").find('img').attr('src', '<?php echo WEBIMG . '/footcollectmoren.png'; ?>');
                        }
                    }
                    Tip(response.message);
                },
                beforeSend: function () {
                }
            });
        });
    })
</script>

<div id="guige" style="">
    <div class="product-list newproduct" style="padding-bottom: 40px;border: none;">
        <div>
            <img src="<?php echo $ApiData['icon_url']; ?>" style="width: 70px;"/>
            <div class="flt pline" style="line-height: 18px;padding-top: 0;">
                <p class="product"><?php echo $ApiData['name']; ?></p>
                <p class="guige"><?php echo $ApiData['mass_packing']; ?></p>
                <p class="price">￥<?php echo $ApiData['channel_price']; ?></p>
            </div>
        </div>
        <div class="shuxing" id="slectradio" style="overflow: auto;max-height: 78px;">
            <p class="product">属性：</p>
            <?php foreach ($ApiData['sku_info'] as $vv) { ?>
                <div class="sku_box">
                    <div class="flt shuxing-adjust">
                        <p class="product"><?php echo $vv['attr']; ?></p>
                    </div>
                    <div class="flt cart" style="width: 8%;padding-top:5px;">
                        <label onclick="selectPro(this)"
                               rel="<?php echo $vv['product_id'] . '_' . $vv['id']; ?>"
                               title="<?php echo $vv['attr']; ?>"></label>
                    </div>
                </div>
            <?php } ?>
        </div>

        <div class="flt pline" style="width: 15%;border: none;">
            <p class="product">数量：</p>
        </div>
        <div class="flt text-right" style="width: 85%;padding-right: 3%;box-sizing: border-box;border: none;">
            <div class="inputNum" style="margin-bottom:5px;">
                <span class="minus minadd" onclick="javascript:num_down(this);return false;">-</span>
                <span class="proNum">
                    <input type="text" name="num" value="1" autocomplete="off">
                    <input type="hidden" name="gid" value="" autocomplete="off">
                </span>
                <span class="add minadd" onclick="javascript:num_up(this);return false;">+</span>
            </div>
        </div>
    </div>
    <div class="foot-confirm text-center" onclick="addCart();">确定</div>
    <div class="closeicon" onclick="CloseDiv();">
        <img src="<?php echo WEBIMG; ?>/dialog_close.png" style="width: 22px;"/>
    </div>
</div>
<div id="fade" class="black_overlay" onclick="CloseDiv();"></div>

<script type="text/javascript" src="<?php echo WEBJS . '/public.js'; ?>"></script>
<script>
    function num_down(el) {
        var num = parseInt($(el).siblings().find('input[name="num"]').val());
        if (num > 1) {
            num = num - 1;
        } else {
            num = 1;
        }
        $(el).siblings().find('input[name="num"]').val(num);
    }
    function num_up(el) {
        var num = parseInt($(el).siblings().find('input[name="num"]').val());
        if (num > 0) {
            num = num + 1;
        } else {
            num = 1;
        }
        $(el).siblings().find('input[name="num"]').val(num);
    }
    function selectPro(el) {
        var key = $(el).attr('rel');
        var title = $(el).attr('title');
        $(".sku_box").find('label').removeClass('checked');
        $(el).addClass('checked');
        $(".proNum").find('input[name="gid"]').val(key);
        $("#guige_txt").html(title);
    }
    function addCart(el) {
        var gid = $(".proNum").find('input[name="gid"]').val();
        var num = parseInt($(".proNum").find('input[name="num"]').val());
        if (gid && num) {
            $.ajax({
                url: '/ajax/product/',
                type: 'post',
                dataType: 'json',
                data: {'ajaxdata': 'addCart', 'id': gid, 'num': num},
                success: function (response) {
                    Tip(response.message);
                    CloseDiv();
                },
                beforeSend: function () {
                }
            });
        } else {
            Tip('请选择产品参数');
            return false;
        }
    }
    function sendOrder(el) {
        var gid = $(".proNum").find('input[name="gid"]').val();
        var num = parseInt($(".proNum").find('input[name="num"]').val());

        if (gid && num) {
            $.ajax({
                url: '/ajax/cart/',
                type: 'post',
                dataType: 'json',
                data: {'ajaxdata': 'buyNow', 'id': gid, 'num': num},
                success: function (response) {
                    layer.closeAll();
                    if (response.code == 200) {
                        var form = $("<form style='display:none;' method='post' action='<?php echo WEBROOT . '/order/index'?>'></form>");
                        $.each(response.result, function (key, value) {
                            var input = $("<input type='hidden'>");
                            input.attr({"name": key});
                            input.val(value);
                            form.append(input);
                        });
                        form.appendTo(document.body);
                        form.submit();
                    } else {
                        Tip(response.message);
                        return false;
                    }
                },
                beforeSend: function () {
                    layer.load(1);
                }
            });
        } else {
            Tip('请选择产品参数');
            return false;
        }
    }
</script>